<template>
	<view class="content">
		<uni-forms ref="baseForm" :modelValue="baseFormData" :rules="rules" label-position="top" label-width="200">
			<uni-forms-item label="行驶证" required name="deliverImage">
				<u-image width="100%" height="300rpx" :src="baseFormData.deliverImage"></u-image>
				<view style="margin-top: 40rpx;">
					<u-button :plain="true"  type="primary" @click="chooseMedia">选择文件</u-button>
				</view>
			</uni-forms-item>
			<uni-forms-item label="车牌号" required name="plateNo">
				<uni-easyinput v-model="baseFormData.plateNo" placeholder="请输入车牌号" />
			</uni-forms-item>
			<uni-forms-item label="车主姓名">
				<uni-easyinput v-model="baseFormData.owner" placeholder="请输入类型" />
			</uni-forms-item>
			<uni-forms-item label="vin">
				<uni-easyinput v-model="baseFormData.vin" placeholder="请输入vin" />
			</uni-forms-item>
			<uni-forms-item label="车辆颜色">
				<uni-easyinput v-model="baseFormData.color" placeholder="请输入颜色" />
			</uni-forms-item>
		</uni-forms>
		<u-button type="primary" @click="save">保存</u-button>
	</view>
</template>

<script>
	import {
		domain
	} from '@/utils/config.js'

	export default {
		data() {
			return {
				action: domain + "owner/file/upload",
				fileList: [],
				sexs: [{
					text: '男',
					value: 0
				}, {
					text: '女',
					value: 1
				}],
				baseFormData: {
					plateNo: "",
					vin: "",
					deliverImage: '',
					type: '',
					color: '',
					owner: ""
				},
				// 校验规则
				rules: {
					deliverImage: {
						rules: [{
							required: true,
							errorMessage: '行驶证不能为空'
						}]
					},
					plateNo: {
						rules: [{
							required: true,
							errorMessage: '车牌号不能为空'
						}]
					}
				},
				openid: uni.getStorageSync('openid'),
			}
		},
		onLoad() {
			uni.request({
				url: "vehicle/getVehicle?openid=" + this.openid,
				method: "GET",
				success: (res) => {
					console.log(res);
					this.baseFormData = {
						...res.data.data
					}
					this.fileList = [{
						url: res.data.data.deliverImage
					}];
				}
			})
		},
		methods: {
			chooseMedia() {
				uni.chooseMedia({
					sizeType: ["compressed"],
					success: (e) => {
						console.log(e);
						 const tempFilePaths = e.tempFiles[0];
						 wx.uploadFile({
							filePath: tempFilePaths.tempFilePath,
							name: 'file',
							url: domain + "vehicle/vehicleLicenseOCR",
							success: (res) => {
								console.log(res);
								const data = JSON.parse(res.data);
								let Info = data.data;
								console.log(Info);
								if(Info && Info.vin){
									this.baseFormData = {
										...this.baseFormData,
										vin: Info.vin,
										plateNo: Info.plate_num_b,
										owner: Info.owner,
										deliverImage:Info.imgUrl
									}
								}else{
									uni.showToast({
										title: data.msg,
										duration: 2000,
										icon:"none"
									});
								}
								
							},
							fail: (res) => {
								console.log(res);
							}
						})
					}
				})
			},
			submit() {
				this.$refs.baseForm.validate().then(res => {
					console.log('表单数据信息：', res);
					this.save();

				}).catch(err => {
					console.log('表单错误信息：', err);
				})
			},
			save() {
				console.log(this.fileList);
				uni.request({
					url: "vehicle/saveVehicle",
					method: "POST",
					data: {
						...this.baseFormData,
						deliverImage: this.fileList[0].url,
						openid: this.openid
					},
					success: (res) => {
						uni.showToast({
							title: '保存成功',
							duration: 2000,
						});
						uni.switchTab({
							url: "/pages/my/index"
						})
					}
				})
			}
		}
	}
</script>

<style scoped lang="less">
	.content {
		padding: 0 20rpx;
	}
</style>